@import './rem.scss';
@import './../theme/color.scss';

.full-screen{
    width: 100%;
    height: 100%;
}

// width
.pct100{
    width: 100%;
}
.pct95{
    width: 95%;
}
.pct90{
    width: 90%;
}
.pct80{
    width: 80%;
}
.pct70{
    width: 70%;
}
.pct60{
    width: 60%;
}
.pct50{
    width: 50%;
}
.pct40{
    width: 40%;
}
.pct30{
    width: 30%;
}
.pct20{
    width: 20%;
}
.pct10{
    width: 10%;
}

.h100{
    height: 100%;
}
.h90{
    height: 90%;
}

.noshrink{
    flex-shrink: 0;
}

.text-large{
    font-size: pxTorem(70px) !important;
}
.text-xxxl{
    font-size: pxTorem(35px) !important;
}
.text-xxl{
    font-size: pxTorem(32px) !important;
}
.text-30{
    font-size: pxTorem(30px) !important;
}
.text-xl{
    font-size: pxTorem(28px) !important;
}
.text-l{
    font-size: pxTorem(24px) !important;
}
.text-22{
    font-size: pxTorem(22px) !important;
}
.text-m{
    font-size: pxTorem(20px) !important;
}
.text-s{
    font-size: pxTorem(16px) !important;
}
.text-center{
    text-align: center;
}
.text-left{
    text-align: left;
}
.text-right{
    text-align: right;
}

.text-dark{
    color: $color-dark;
}
.text-orange{
    color: $color-orange;
}
.color-white{
    color: $color-white;
}
.color-gray{
    color: $color-gray;
}
.color-warning{
    color: $warning;
}
.color-error{
    color: $error;
}
.color-primary{
    color: $primary;
}


.margin-t-l{
    margin-top: pxTorem(50px);
}
.margin-t-m{
    margin-top: pxTorem(20px);
}
.margin-t-s{
    margin-top: pxTorem(10px);    
}
.margin-t-xs{
    margin-top: pxTorem(8px);
}
.margin-b-s{
    margin-bottom: pxTorem(10px);
}

.margin-l-s{
    margin-left: pxTorem(10px);
}
.margin-l-m{
    margin-left: pxTorem(20px);
}
.margin-r-s{
    margin-right: pxTorem(10px);
}
.padding-t-m{
    padding-top: pxTorem(20px);
}

.padding-s{
    padding: pxTorem(10px);
}
.relative{
    position: relative;
}
.btn-warning{
    background: $warning;
    color: $color-white;
    width: pxTorem(300px);
    height: pxTorem(50px);
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.btn-primary{
    background: $mpj-primary;
    color: $color-white;
    padding: pxTorem(10px);
}
.btn-cancel{
    background: $bd-gray;
    color: $color-dark;
    padding: pxTorem(10px);
}

.iconfont{
    margin-right: pxTorem(10px);
}

.setup-padding{
    padding: pxTorem(20px);
}

.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}